<!--

=========================================================
* Neumorphism UI - v1.0.0
=========================================================

* Product Page: https://themesberg.com/product/ui-kits/neumorphism-ui
* Copyright 2020 Themesberg MIT LICENSE (https://www.themesberg.com/licensing#mit)

* Coded by https://themesberg.com

=========================================================

* The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

-->
<!DOCTYPE html>
<html lang="en">

<head>
    @@include('./_head.html', {
        "path": "../..",
        "title": "Neumorphism UI - About us"
    })
</head>

<body>
    @@include('./_navigation.html', {
        "path": "../..",
        "classes": "navbar-light"
    })
    <main>
        <!-- Hero -->
        <div class="section section-header pb-7">
            <div class="container">
                <div class="row justify-content-center">
                    <div class="col-12 col-lg-8 text-center">
                        <h1 class="display-2 mb-4">We are Themesberg</h1>
                        <p class="lead mb-5">Themesberg is an independent branding & experience design company working at the intersection of culture, design, and technology. </p>
                        <a class="btn btn-primary" href="./contact.html"><span class="fas fa-book-reader mr-2"></span>Our works</a></div>
                </div>
            </div>        
        </div>
        <!-- End of Hero section -->
        <section class="section section-lg pt-0">
            <div class="container">
                <div class="row">
                    <div class="col">
                        <div class="card bg-primary shadow-soft border-light p-4">
                            <div class="row">
                                <div class="col-12 col-lg-4 px-md-0 mb-4 mb-lg-0">
                                    <div class="card-body text-center bg-primary py-5">
                                        <div class="icon icon-shape shadow-inset border-light rounded-circle mb-3">
                                            <span class="far fa-eye"></span>
                                        </div>
                                        <!-- Heading -->
                                        <h2 class="h4 mr-2">
                                            Audience
                                        </h2>
                                        <!-- Text -->
                                        <p class="mb-0">At Themesberg, we use human, brand, and cultural insights to unlock strategic business opportunities for clients.</p>
                                    </div>
                                </div>
                                <div class="col-12 col-lg-4 px-md-0 mb-4 mb-lg-0">
                                    <div class="card-body text-center bg-primary py-5">
                                        <div class="icon icon-shape shadow-inset border-light rounded-circle mb-3">
                                            <span class="fas fa-medal"></span>
                                        </div>
                                        <!-- Heading -->
                                        <h2 class="h4 mr-2">
                                            Branding
                                        </h2>
                                        <!-- Text -->
                                        <p class="mb-0">Despite being cautioned not to judge a book by its cover, we all do it every day. We making your site looks better.</p>
                                    </div>
                                </div>
                                <div class="col-12 col-lg-4 px-md-0">
                                    <div class="card-body text-center bg-primary py-5">
                                        <div class="icon icon-shape shadow-inset border-light rounded-circle mb-3">
                                            <span class="fas fa-puzzle-piece"></span>
                                        </div>
                                        <!-- Heading -->
                                        <h2 class="h4 mr-2">
                                            Production
                                        </h2>
                                        <!-- Text -->
                                        <p class="mb-0">Today, truly creative sells. Get innovative ideas and polished finish pieces from our creative agency.</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <!-- Section -->
        <section class="section section-lg pt-0">
            <div class="container">
                <div class="row align-items-center justify-content-around">
                    <div class="col-md-6 col-xl-6 mb-5">
                        <div class="card bg-primary shadow-soft border-light organic-radius p-3">
                            <img class="organic-radius img-fluid" src="../../assets/img/about-us-1.jpg" alt="modern desk">
                        </div>
                    </div>
                    <div class="col-md-6 col-xl-5 text-center text-md-left">
                        <h2 class="h1 mb-4">Design with us, Develop Anything.</h2>
                        <p class="lead">Themesberg is an experienced and passionate group of designers, developers, project managers, writers and artists. Every client we work with becomes a part of the team. Together we face the challenges and celebrate the victories.</p>
                        <p class="lead">Our small team is active in the creative community, endlessly interested in what’s next, and generally pleasant to be around.</p>
                        <img src="../../assets/img/signature.svg" alt="signature" class="mt-4" width="150">
                    </div>
                </div>
            </div>
        </section>
        <!-- End of section -->
        <!-- Section -->
        <section class="section section-lg pt-0">
            <div class="container">
                <div class="row">
                    <div class="col-12 col-sm-4 col-lg-4 text-center">
                        <!-- Visit Box -->
                        <div class="icon-box mb-4">
                            <div class="icon icon-shape shadow-soft border border-light rounded-circle mb-4">
                                <span class="far fa-smile-beam"></span>
                            </div>
                            <h3 class="h5">Team Members</h3>
                            <span class="counter display-3 text-gray d-block">500</span>
                        </div>
                        <!-- End of Visit Box -->
                    </div>
                    <div class="col-12 col-sm-4 col-lg-4 text-center">
                        <!-- Call Box -->
                        <div class="icon-box mb-4">
                            <div class="icon icon-shape shadow-soft border border-light rounded-circle mb-4">
                                <span class="far fa-eye"></span>
                            </div>
                            <h3 class="h5">Projects Published</h3>
                            <span class="counter display-3 text-gray d-block">2400</span>
                        </div>
                        <!-- End of Call Box -->
                    </div>
                    <div class="col-12 col-sm-4 col-lg-4 text-center">
                        <!-- Email Box -->
                        <div class="icon-box mb-4">
                            <div class="icon icon-shape shadow-soft border border-light rounded-circle mb-4">
                                <span class="fas fa-globe-europe"></span>
                            </div>
                            <h3 class="h5">Countries</h3>
                            <span class="counter display-3 text-gray d-block">80</span>
                        </div>
                        <!-- End of Email Box -->
                    </div>
                </div>
            </div>
        </section>
        <!-- End of section -->
        <!-- Section -->
        <section class="section section-lg pt-0">
            <div class="container">
                <div class="row justify-content-center mb-5">
                    <h2 class="h1">Our Team</h2>
                </div>
                <div class="row">
                    <div class="col-12 col-md-6 col-lg-4">
                        <!-- Profile Card -->
                        <div class="card bg-primary shadow-soft border-light text-center py-4 mb-5">
                            <div class="profile-image shadow-inset border border-light bg-primary rounded-circle p-3 mx-auto">
                                <img src="../../assets/img/team/profile-picture-1.jpg" class="card-img-top shadow-soft p-2 border border-light rounded-circle" alt="Neil Avatar">
                            </div>
                            <div class="card-body">
                                <h3 class="h5 mb-2">Neil Sims</h3>
                                <span class="h6 font-weight-normal text-gray mb-3">Co-Founder Themesberg</span>
                                <ul class="list-unstyled d-flex justify-content-center my-3">
                                    <li>
                                        <a href="#" target="_blank" aria-label="facebook social link" class="icon icon-xs icon-facebook mr-3">
                                            <span class="fab fa-facebook-f"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="twitter social link" class="icon icon-xs icon-twitter mr-3">
                                            <span class="fab fa-twitter"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="slack social link" class="icon icon-xs icon-slack mr-3">
                                            <span class="fab fa-slack-hash"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="dribbble social link" class="icon icon-xs icon-dribbble mr-3">
                                            <span class="fab fa-dribbble"></span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <!-- End of Profile Card -->
                    </div>
                    <div class="col-12 col-md-6 col-lg-4">
                        <!-- Profile Card -->
                        <div class="card bg-primary shadow-soft border-light text-center py-4 mb-5">
                            <div class="profile-image shadow-inset border border-light bg-primary rounded-circle p-3 mx-auto">
                                <img src="../../assets/img/team/profile-picture-3.jpg" class="card-img-top shadow-soft p-2 border border-light rounded-circle" alt="Bonnie Avatar">
                            </div>
                            <div class="card-body">
                                <h3 class="h5 mb-2">Bonnie Green</h3>
                                <span class="h6 font-weight-normal text-gray mb-3">Marketing Specialist</span>
                                <ul class="list-unstyled d-flex justify-content-center my-3">
                                    <li>
                                        <a href="#" target="_blank" aria-label="facebook social link" class="icon icon-xs icon-facebook mr-3">
                                            <span class="fab fa-facebook-f"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="twitter social link" class="icon icon-xs icon-twitter mr-3">
                                            <span class="fab fa-twitter"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="slack social link" class="icon icon-xs icon-slack mr-3">
                                            <span class="fab fa-slack-hash"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="dribbble social link" class="icon icon-xs icon-dribbble mr-3">
                                            <span class="fab fa-dribbble"></span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <!-- End of Profile Card -->
                    </div>
                    <div class="col-12 col-md-6 col-lg-4">
                        <!-- Profile Card -->
                        <div class="card bg-primary shadow-soft border-light text-center py-4 mb-5">
                            <div class="profile-image shadow-inset border border-light bg-primary rounded-circle p-3 mx-auto">
                                <img src="../../assets/img/team/profile-picture-2.jpg" class="card-img-top shadow-soft p-2 border border-light rounded-circle" alt="Christopher avatar">
                            </div>
                            <div class="card-body">
                                <h3 class="h5 mb-2">Christopher Wood</h3>
                                <span class="h6 font-weight-normal text-gray mb-3">Web Designer</span>
                                <ul class="list-unstyled d-flex justify-content-center my-3">
                                    <li>
                                        <a href="#" target="_blank" aria-label="facebook social link" class="icon icon-xs icon-facebook mr-3">
                                            <span class="fab fa-facebook-f"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="twitter social link" class="icon icon-xs icon-twitter mr-3">
                                            <span class="fab fa-twitter"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="slack social link" class="icon icon-xs icon-slack mr-3">
                                            <span class="fab fa-slack-hash"></span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#" target="_blank" aria-label="dribbble social link" class="icon icon-xs icon-dribbble mr-3">
                                            <span class="fab fa-dribbble"></span>
                                        </a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <!-- End of Profile Card -->
                    </div>
                </div>
            </div>
        </section>
        <!-- End of section -->
    </main>

    @@include('./_footer.html', {
        "path": "../..",
        "classes": "bg-primary"
    })

    @@include('./_scripts.html', {
        "path": "../.."
    })
</body>

</html>